/* Obecný styl pro všechny benefitBanner – platí na všech zařízeních jako základ s vysokou prioritou */
html body .benefitBanner,
html body .benefitBanner.position--benefitHomepage,
html body .benefitBanner.position--benefitProduct,
html body .benefitBanner.position--benefitCategory {
    background-color: #e3f1ff !important; /* Světle modrá na všech zařízeních */
    border-radius: 20px !important; /* Zaoblení na všech zařízeních */
}

/* Další obecné styly – platí všude */
html body .benefitBanner {
    padding: 20px 20px 5px 20px !important;
    margin-bottom: 10px !important;
}
html body .benefitBanner__item {
    margin-bottom: 0 !important;
}
html body .benefitBanner__data p:last-child {
    margin-bottom: 0 !important;
}
html body .benefitBanner.position--benefitHomepage {
    margin-bottom: 50px !important;
    padding-bottom: 5px !important;
}
html body .benefitBanner.position--benefitProduct,
html body .benefitBanner.position--benefitCategory {
    padding: 20px 20px 5px 20px !important;
    margin-bottom: 10px !important;
}

/* Responsivní úpravy pro standardní zařízení – jen upravují velikosti, background zůstává vynucený */

/* Mobilní zařízení (do 768px – iPhone, Android mobily) */
@media screen and (max-width: 767px) {
    html body .benefitBanner {
        padding: 15px 15px 5px 15px !important;
        border-radius: 15px !important;
        margin-bottom: 10px !important;
    }
    html body .benefitBanner.position--benefitHomepage {
        margin-bottom: 30px !important;
    }
}

/* Tablety a malé notebooky (768-1023px – iPad, malé laptopy) */
@media screen and (min-width: 768px) and (max-width: 1023px) {
    html body .benefitBanner {
        padding: 20px 20px 5px 20px !important;
        margin-bottom: 10px !important;
    }
    html body .benefitBanner.position--benefitHomepage {
        margin-bottom: 40px !important;
    }
}

/* Standardní desktopy a monitory (1024-1919px – většina laptopů a Full HD monitorů) */
@media screen and (min-width: 1024px) and (max-width: 1919px) {
    html body .benefitBanner {
        padding: 20px 20px 5px 20px !important;
        margin-bottom: 10px !important;
    }
    html body .benefitBanner.position--benefitHomepage {
        margin-bottom: 50px !important;
    }
    /* Extra vynucení pro potenciální konflikty */
    html body .benefitBanner {
        background-color: #e3f1ff !important;
    }
}

/* Velké monitory a ultra-wide (od 1920px – 1920x1080+, 4K, atd.) */
@media screen and (min-width: 1920px) {
    html body .benefitBanner {
        padding: 25px 25px 5px 25px !important;
        margin-bottom: 10px !important;
    }
    html body .benefitBanner.position--benefitHomepage {
        margin-bottom: 60px !important;
    }
    /* Extra vynucení pro konflikty na velkých obrazovkách */
    html body .benefitBanner {
        background-color: #e3f1ff !important;
    }
}